<!DOCTYPE html>
<html>
<head>
<title>外卖订单-速订客</title>
<meta ht_topp-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta ht_topp-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta name="keyword" content="">
<meta name="description" content="">
<link rel="stylesheet" rev="stylesheet" href="<?=STATIC_URL;?>css/base.css" type="text/css">
<link rel="stylesheet" rev="stylesheet" href="<?=STATIC_URL;?>css/order.css" type="text/css">
<link rel="icon" type="image/x-icon" href="<?=STATIC_URL;?>favicon.ico">
<link rel="shortcut icon" type="image/x-icon" href="<?=STATIC_URL;?>favicon.ico">
</head>
<body>
<?php include dirname(__FILE__).'/../com-header-sample.tpl.php'; ?>
<!------------------------------------>
<style>
input,textarea{color:#666}

.order_table{font-size:14px;padding:0 15px;}
.order_table table{width:960px; text-align:center; margin:0 auto;border:none}
.order_table th, .order_table td{padding: 4px;}
.order_table th{font-weight:bold;color:#333; padding:8px;}
.order_table input,.order_table textarea{border:1px #aaa solid; padding: 2px;}

h2.navbar {
    background-color: #2E2F2F;
    clear: both;
    color: #FFFFFF;
    font-family: 宋体,"Microsoft YaHei","Steinem Roman",Arial,sans-serif,"黑体";
    font-size: 14px;
    height: 27px;
    line-height: 27px;
    margin-top: 20px;
    text-indent: 5px;
    width: 960px;
}
.box_top{
    border-bottom:1px #2E2F2F solid;
}
.box_bot{
    border:1px #aaa solid;
}
table.t_top{width:96%;}
table.t_top td, table.t_top th{border-bottom:1px #ccc dashed}
table.t_mid{width:48%;}
table.t_mid td{border:none;}



.box_mid h3 {

    color: #000000;
    font-size: 14px;
    padding: 5px;
    text-indent: 20px;
}

.box_mid p {
    margin-bottom: 10px;
}
.box_mid label {
    float: left;
    height: 20px;
    line-height: 20px;
    margin-right: 10px;
    text-align: right;
    width: 100px;
}
.forminfo{
height:90px; padding:20px 0;
}
.loginformbox {
float:left; width:470px;
}
.loginformbox h3{
    background-color: #F6EBA9;
}
.loginformbox .forminfo {
    background-color: #FFFBE0;
    position: relative;
}.contactformbox{
float:right; width:470px;}
.contactformbox .forminfo {
    background-color: #EFF9F8;
    position: relative;
}
.contactformbox h3{
    background-color: #CBEAE5;
}

input.btns {
    background: url("/img/common/site_bg.png") repeat-x 0 -65px #DD0000;
    border: 0 none;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    font-weight: bold;
    margin: 0;
}

</style>
<div id="container">
  <div class="order_table">
    <h2 class="navbar">菜单明细</h2>
    <div class="box_top">
      <table class="t_top">
        <thead>
          <tr>
            <th>序号</th>
            <th>美食名称</th>
            <th>原价</th>
            <th>折扣价</th>
            <th>数量</th>
            <th>小计</th>
            <th>口味</th>
          </tr>
        </thead>
        <tbody id="cartTable">
<?php
    $i = $price = $money = $total = 0;
    foreach($data as $item){
         $money = doubleval($item['number']*$item['money']); //标价
         $price = doubleval($item['number']*$item['price']); //售价（折扣后价格）
?>
          <tr id="dish_<?=$item['dish_id'];?>">
            <td><?=(++$i);?></td>
            <td><?=h($item['name']);?></td>
            <td><s><span class="money"><?=h($item['money']);?></span>元</s></td>
            <td><span class="price"><?=h($item['price']);?></span>元</td>
            <td align="center"><input type="text" name="itemNum[<?=$item['dish_id'];?>]" size="4" value="<?=h($item['number']);?>" autocomplete="off" onClick="changePrice(<?=$item['dish_id'];?>)" onchange="changePrice(<?=$item['dish_id'];?>)" /></td>
            <td><span class="count"><?=h($price);?></span></td>
            <td><a href="#" onclick="delCart(<?=$item['dish_id'];?>)">删除</a></td>
          </tr>
<?php
        $total += $price;
    }
?>
        </tbody>
        <tfoot>
          <tr>
            <td colspan="7" style="border:none;height:40px;text-align:right">合计：<span id="totalfee" class="price"><?=$total;?></span> 元，节省：<span id="savefee" class="price">0</span> 元<!--，积分51分--></td>
          </tr>
        </tfoot>
      </table>
    </div>
    <h2 class="navbar">帐号信息</h2>
    <div class="box_mid">
      <div class="loginformbox">
        <h3>我有速订帐号</h3>
        <div class="forminfo">
          <form method="post" name="loginForm" id="loginForm">
            <fieldset>
              <p>
                <label for="emailOrPhone1">邮箱或手机</label>
                <input type="text" autocomplete="off" class="textfield" name="emailOrPhone1" id="emailOrPhone1">
              </p>
              <p>
                <label for="password">密码</label>
                <input type="password" class="textfield" name="password" id="password">
                <input type="submit" class="btns" value="&nbsp; 登 录 &nbsp;" id="submit1">
              </p>
            </fieldset>
          </form>
          <div class="ajaxloading" id="submit1load"><img width="16" height="16" src="/images/35.gif"></div>
          <div class="email_tip" id="email_tip"></div>
          <p class="errotips" id="loginErrorTip"></p>
        </div>
      </div>
      <div class="contactformbox">
        <h3>没有帐号<span>(不用注册，输入手机或邮箱，以便接收就餐凭证)</span></h3>
        <div class="forminfo">
          <form method="post" name="contactform" id="contactform">
            <fieldset>
              <p>
                <label for="emailOrPhone2">邮箱或手机</label>
                <input type="text" class="textfield" name="emailOrPhone2" id="emailOrPhone2">
                <input type="hidden" name="emailFlag" id="emailFlag">
                <input type="hidden" value="九都餐厅" name="restName" id="restName">
                <input type="submit" class="btns" value="&nbsp; 提 交 &nbsp;" id="submit2">
              </p>
            </fieldset>
          </form>
        </div>
      </div>
      <div class="clear"></div>
    </div>
    <h2 class="navbar">送餐信息</h2>
    <div style="background-color:#FFFFCC;padding: 10px;width:960px;" class="clear">
      <div class="last_payment_info"> <span><b>菜单金额：</b><span id="last_totalfee" class="price">0</span>元;&nbsp;&nbsp;</span>
        <span id="forservice"><b>服务费：</b><span id="last_servicefee" class="price">0</span>元;&nbsp;&nbsp;</span>
        <span class=""> <b>共节省：</b><span id="last_savefee" class="price">0</span>元;&nbsp;&nbsp;
        <b>您需为本单支付：￥</b><b id="total" class="price large">0</b> </span> </div>
    </div>
    <div class="box_bot">
      <table class="t_bot">
        <tbody>
          <tr>
            <th width="100">联 系 人</th><td align="left"><input type="text" name="realname" /></td>
          </tr>
          <tr>
            <th>手 &nbsp;&nbsp; &nbsp;&nbsp; 机</th><td align="left"><input type="text" name="mobile" /></td>
          </tr>
          <tr>
            <th>备用电话</th><td align="left"><input type="text" name="telphone" /></td>
          </tr>
          <tr>
            <th>送餐地址</th><td align="left"><input type="text" name="address" size="50" /></td>
          </tr>
          <tr>
            <th valign="top">备 &nbsp;&nbsp; &nbsp;&nbsp; 注</th><td align="left"><textarea name="memo" cols="48"></textarea></td>
          </tr>
        </tbody>
        <tfoot>
          <tr>
            <td colspan="7">&nbsp;</td>
          </tr>
        </tfoot>
      </table>
    </div>
    <p>&nbsp;</p>
  </div>
</div>

<!------------------------------------>
<? include dirname(__FILE__).'/../com-footer.tpl.php'; ?>
<script type="text/javascript" src="<?=STATIC_URL;?>js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
function delCart(id){
    if(confirm('确实要删除该菜品么？')){
        $("#dish_" + id).remove();
    }
    totalPrice();
}

function changePrice(id){
    var oTr = $("#dish_" + id);
    var count = parseInt(oTr.find("input").val(), 10) * parseFloat(oTr.find(".price").html(), 10)
    oTr.find(".count").html(count);

    totalPrice();
}

function totalPrice(){
    var oItem = $("#cartTable").find("tr");
    var cnt   = oItem.size();
    var money = 0; //标价
    var price = 0; //售价
    oItem.each(function(){
        money += parseInt($(this).find("input").val(), 10) * parseFloat($(this).find(".money").html(), 10);
        price += parseInt($(this).find("input").val(), 10) * parseFloat($(this).find(".price").html(), 10);
    });

    $("#totalfee,#last_totalfee").html(price);
    $("#savefee,#last_savefee").html(money - price);
}

$(document).ready(function() {
    totalPrice();
});
</script>
</body>
</html>